@charset "UTF-8";
/******
  首页，
  菜单，
  顶部，
  底部,
  布局
*******/
html{
    color: #666;
    background-color: #0000001d;
}

/*
    default theme
*/

.no-transition *{
    transition: none !important;
}

#frame2_app>.layout{
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
}

#frame2_app > .layout > .content {
    position: absolute;
    left: 200px;
    top: 39px;
    bottom: 0;
    right: 0;
}

@media (min-width: 768px) {
    #frame2_app > .layout > .content {
        padding: 20px;
    }
}

/* header */
#frame2_app>.layout>.header{
    height: 39px;
    background-color:  #fff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.1);
}

#frame2_app * {
    transition: all 0.3s;
}
textarea{
    transition: none !important;
}
#frame2_app>.layout>.header>*>*,#frame2_app>.layout>.header>*{
    line-height: 40px;
    color:#333;
}
#frame2_app>.layout>.header>*>*>*{
    color:#333;
}
#frame2_app>.layout>.header>.logo{
    overflow: hidden;
}

.header > .layui-nav {
    padding: 0 0;
}

.header .layui-nav-child {
    top: 39px;
}

.header > .head-left a, .header > .layui-nav .layui-nav-item a {
    padding: 0 15px;
}

.header .layui-nav-child {
    top: 39px;
}

#frame2_app_flexible > i:after {
    content: "\e668";
}

/* side menu */
#frame2_app>.layout>.side-menu{
    position: absolute;
    left: 0;
    top: 39px;
    bottom: 0;
    width: 200px;
    overflow: hidden;
    background-color: #24a896;
    z-index: 1001;
}
#frame2_app>.layout>.side-menu>.menu-container{
    width: 220px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#frame2_app > .layout > .side-menu > .menu-container > .menu > .menu-item > a {
    line-height: 40px;
    height: 40px;
}

.side-menu > div > dl.menu {
    width: 200px;
}
.side-menu>div>.menu>.menu-item {
    padding-left:0;
}
.side-menu>div>.menu a {
    padding-left:15px;
    color:#e6e6e6;
}

.side-menu dd.menu-item > a:not(:only-child):after {
    content: "<";
    position: absolute;
    right: 15px;
}

.side-menu dd.menu-item.open > a:not(:only-child):after {
    transform: rotate(-90deg);
}
.side-menu .menu-item {
    padding-left:20px;
}

.side-menu * {
    transition: all .3s;
    -webkit-transition: all .3s;
}
.side-menu .menu .menu-item a{
    line-height: 32px;
    position: relative;

    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;

}

.side-menu .menu .menu-item.active a {
    color: #fff;
    background-color: #0acab8;
}

.side-menu .menu .menu-item a:hover {
    color: #fff;
    background-color: #2be3d5;
}

.side-menu .menu .menu-item a:before {
    content: "|";
    position: absolute;
    left: -2px;
    /*     right:0px;
        bottom:0px;
        height:2px; */
    color: #fff;
    background-color: rgba(0, 0, 0, .2);
    opacity: 0;
}

.side-menu .menu .menu-item > a:hover:before {
    opacity: 1;
    left: 0;
}
.menu-container > dl.menu > dd.menu-item >dl{
    background-color:#00897d;
}

#frame2_app .menu-container > dl > dd dl > dd > a {

    height: 0;
}

#frame2_app .menu-container > dl dd.open > dl > dd > a {

    height: 32px;
}

#frame2_app .menu-container > dl dd.close dl > dd > a {

    height: 0px;
}


.layui-side-menu{
    position: absolute;
    top: 39px;
    bottom: 0;
    left: 220px;
    z-index: 10001;
}

/* shrink */
.shrink #frame2_app_flexible > i:after {
    content: "\e66b";
}

#frame2_app.shrink > .layout {
    left: -200px;
}

@media (max-width: 768px) {
    #frame2_app > .layout {
        right: -200px;
    }

    #frame2_app.shrink > .layout {
        right: 0;
    }

    #shade {
        position: absolute;
        top: 39px;
        bottom: 0;
        left: 200px;
        right: 0;
        z-index: 100003;
        background-color: #00000059;
        animation: a-shade .3s;
    }

    @keyframes a-shade {
        0% {
            opacity: 0;
            left: 0;
        }
        100% {
            left: 200px;
            opacity: 1;
        }
    }

    #frame2_app.shrink #shade {
        display: none;
        left: 0;
    }
}

.data-table th[sortable] {
    cursor: pointer;
}

.edit-panel .edit-panel-head {
    padding-left: 35px;
}
